﻿@model MvcMercadoLibre.Models.Articulo
@{
    ViewBag.Title = "Details";
}
<script language="javascript" type="text/javascript">
    function comprar(bool) {
        var estilo = "none";
        if (bool)
        { estilo = "block"; }
        aceptacion.style.display = estilo;
        tabla.style.display = estilo;
        spcantidad.innerHTML = document.getElementById('cantidad').value;
    }
</script>
@using (Html.BeginForm("EnviarComprar", "Store", FormMethod.Post))
{
    @Html.Image("../../Content/Images/Products", @Model.UrlImagen)
    <h2>
        Articulo: @Model.Nombre
    </h2>
    <h2>
        Precio: @Model.Precio
    </h2>
    <h2>
        Cantidad:
        <input type="text" name="cantidad" id="cantidad" style="width:50px;" value="@Model.Cantidad" />
        <input type="hidden" name="id" id="id" value="@Model.Id" />
    </h2>

    <div id="aceptacion" style="display: none; z-index: 5; position: absolute; top: 0;
        left: 0; width: 100%; height: 100%; opacity: 0.5; filter: alpha(opacity = 50);
        background-color: Gray;">
        @* "*@
    </div>
    <table id="tabla" style="display: none; width: 400px; border: 5px solid black; background-color: White;
        opacity: 1; filter: alpha(opacity = 100); position: absolute; top: 100px; left: 350px;
        z-index: 9">
        <tr>
            <td>
                <center>
                    <img src="../../Content/Images/logo.jpg" /></center>
                <br />
                Usted está aceptando la compra de <span id="spcantidad" style="font-size: large">
                </span>&nbsp;unidades de <span style="font-size: large">@Model.Nombre</span>,
                <br />
                una vez realizada esta acción usted asume el compromiso de efectuar la compra al
                ser aceptada por el vendendor.
                <p align="center">
                    @*@Html.ActionLink("Comprar", "EnviarComprar", new { nombre = @Model.Id })*@
                    <input type="submit" value="Comprar" />
                    &nbsp;&nbsp;&nbsp; <a href="javascript:comprar(false);">Cancelar</a>
                </p>
            </td>
        </tr>
    </table>
    <p class="button">
        <a href="javascript:comprar(true);">Comprar</a>
    </p>
}